import React from "react";
import PropTypes from "prop-types";

export let Award = ({ award, awardClicked }) => {
  return (
    <div onClick={e => awardClicked(award.id)}>
      <img className={"banner"} src={award.img} />
      <div style={{ padding: "8px 0 0 10px" }}>奖品:{award.synopsis}</div>
      <div style={{ padding: "8px 0 0 10px" }}>{award.luckyTime} 自动开奖</div>
    </div>
  );
};

Award.propTypes = {
  award: PropTypes.object.isRequired,
  awardClicked: PropTypes.func.isRequired
};

export let AwardList = ({ awardList, awardClicked }) => {
  return (
    <div>
      {awardList.map(item => (
        <Award award={item} key={item.id} awardClicked={awardClicked} />
      ))}
    </div>
  );
};

AwardList.propTypes = {
  awardList: PropTypes.array.isRequired,
  awardClicked: PropTypes.func.isRequired
};
